@model WalkingTec.Mvvm.Doc.ViewModels.SchoolVms.SchoolVm

<wt:fieldset field-set-style="Simple" title="MultiUpload">
 </wt:fieldset>
   <p>MultiUpload控件用于文件上传，常用属性有：</p>
        <table lay-filter="parse-table-demo">
            <thead>
                <tr>
                    <th lay-data="{field:'username', width:200}">属性</th>
                    <th lay-data="{field:'joinTime', width:600}">描述</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Id</td>
                    <td>控件Id，默认根据绑定字段名称生成</td>
                </tr>
                <tr>
                    <td>Field</td>
                    <td>绑定字段，必须绑定一个List&lt;ISubFile&gt;字段，必填</td>
                </tr>
                <tr>
                    <td>Disabled</td>
                    <td>是否禁用</td>
                </tr>
                <tr>
                    <td>Name</td>
                    <td>控件Name，默认根据绑定字段名称生成</td>
                </tr>
                <tr>
                    <td>LabelText</td>
                    <td>标签内容</td>
                </tr>
                <tr>
                    <td>LabelWidth</td>
                    <td>标签的长度，默认为80</td>
                </tr>
                <tr>
                    <td>HideLabel</td>
                    <td>是否隐藏标签</td>
                </tr>
                <tr>
                    <td>FileSize</td>
                    <td>文件大小限制，单位Kb</td>
                </tr>
                <tr>
                    <td>UploadType</td>
                    <td>文件类型限制，可选 AllFiles, ImageFile, ZipFile, ExcelFile, WordFile, PDFFile, TextFile</td>
                </tr>
                <tr>
                    <td>ThumbWidth</td>
                    <td>当文件类型为ImageFile时，指定缩略图宽度可以让框架自动把图片缩小到指定宽度之后再保存</td>
                </tr>
                <tr>
                    <td>ThumbHeight</td>
                    <td>当文件类型为ImageFile时，指定缩略图宽度可以让框架自动把图片缩小到指定高度之后再保存</td>
                </tr>
                <tr>
                    <td>ShowPreview</td>
                    <td>是否使用缩略图预览，当上传文件类别为ImageFile时，默认为true</td>
                </tr>
                <tr>
                    <td>PreviewWidth</td>
                    <td>如果使用缩略图预览，指定缩略图宽度，默认64</td>
                </tr>
                <tr>
                    <td>PreviewHeight</td>
                    <td>如果使用缩略图预览，指定缩略图高度，默认64</td>
                </tr>
                <tr>
                    <td>CustomType</td>
                    <td>如果常用UploadType不支持，可以自定义文件类型限制，例如rar</td>
                </tr>
            </tbody>
        </table>
    <wt:quote>
        <p>MultiUpload控件必须绑定一个List&lt;ISubFile&gt;字段， ISubFile是框架提供的一个接口，用于定义子附件，当Model按照这个数据结构进行定义的时候，框架会自动完成多附件的保存和删除</p>
        <p>可以在appsetting文件种设定SaveFileMode来指定框架附件的保存方式，目前支持DataBase,Local和DFS</p>
        <p>下面的例子在选择文件之后没有效果，因为这个文档项目并没有连接真实的数据库</p>
        <p>请注意Model中定义一个附件数组的写法</p>
    </wt:quote>
        <wt:tab>
          <wt:tabheaders>
            <wt:tabheader title="效果" />
            <wt:tabheader title="代码" />
            <wt:tabheader title="Model" />
          </wt:tabheaders>
            <wt:tabcontents>
                <wt:tabcontent>
                    <wt:form vm="@Model" style="max-width:600px;">
                        <wt:multiupload field="Entity.Photos" upload-type="ImageFile" />
                        <wt:row align="AlignEnum.Right">
                            <wt:submitbutton disabled="true" />
                            <wt:closebutton disabled="true" />
                        </wt:row>
                    </wt:form>
                </wt:tabcontent>
                <wt:tabcontent>
                    <wt:code>
&ltwt:form vm="@@Model" width="600"&gt
    &ltwt:multiupload field="Entity.Photos" upload-type="ImageFile"  /&gt
    &ltwt:row align="AlignEnum.Right"&gt
        &ltwt:submitbutton disabled="true" /&gt
        &ltwt:closebutton disabled="true" /&gt
    &lt/wt:row&gt
&lt/wt:form&gt

                    </wt:code>
                </wt:tabcontent>
                <wt:tabcontent>
                    <wt:code>
    public class School : BasePoco
    {
        [Display(Name = "学校编码")]
        [Required(ErrorMessage = "{0}是必填项")]
        [RegularExpression("^[0-9]{3,3}$", ErrorMessage = "{0}必须是3位数字")]
        public string SchoolCode { get; set; }

        [Display(Name = "学校名称")]
        [StringLength(50, ErrorMessage = "{0}最多输入{1}个字符")]
        [Required(ErrorMessage = "{0}是必填项")]
        public string SchoolName { get; set; }

        //定义附件列表
        public List&lt;SchoolPhoto&gt; Photos { get; set; }
    }

    //继承ISubFile的附件子表
    public class SchoolPhoto : TopBasePoco, ISubFile
    {
        public int SchoolId { get; set; }
        public School School { get; set; }

        //ISubFile定义的字段
        public Guid FileId { get; set; }
        public FileAttachment File { get; set; }
        public int order { get; set; }
    }

                    </wt:code>
                </wt:tabcontent>
            </wt:tabcontents>
        </wt:tab>

    <script>
    layui.use('code',function(){layui.code({ about: false })})
        layui.table.init('parse-table-demo', {
        limit: 100, page: false
        });
    </script>
<script>
  $("#@Model.ViewDivId").parent().css("height", "auto");
</script>
